<nz-tab>
    <ng-template #nzTabHeading>
        <span (click)="getData()">课程管理</span>
    </ng-template>
    <div class="search-add-box">
        课程名称：<nz-input [nzPlaceHolder]="'请输入查询课程名称'" [(ngModel)]="searchValue" style="width: 200px;" [nzSize]="'large'"></nz-input>
        <button nz-button type="submit" class="mar-left" [nzType]="'primary'" [nzSize]="'large'" (click)="search()">查询</button>
        <button nz-button class="btn-right" [nzType]="'default'" [nzSize]="'large'" *ngIf="_checkTable.length > 0" (click)="allDelete()">
            <span>批量删除</span>
        </button>
        <button nz-button class="btn-right" (click)="modal('add', '')" [nzType]="'primary'" [nzSize]="'large'">
            <i class="anticon anticon-plus"></i><span>新建</span>
        </button>
    </div>
    <nz-table #nzTable2 [nzAjaxData]="data" [(nzPageSize)]="tableBPs" [nzTotal]="tableB" [(nzPageIndex)]="tableBPi" (nzPageIndexChange)="getData()"  (nzDataChange)="_displayDataChange($event)" (nzPageSizeChange)="_refreshStatus()" [nzLoading]="_loading">
        <thead nz-thead>
        <tr>
            <th nz-th [nzCheckbox]="true">
                <label nz-checkbox [(ngModel)]="_allChecked" [nzIndeterminate]="_indeterminate" (ngModelChange)="_checkAll($event)">
                </label>
            </th>
            <th  nz-th><span>课程名称</span></th>
            <th  nz-th><span>已关联项目</span></th>
            <th  nz-th><span>已关联班级</span></th>
            <th  nz-th><span>操作</span></th>
        </tr>
        </thead>
        <tbody nz-tbody>
        <tr nz-tbody-tr *ngFor="let data of nzTable2.data;let i = index">
            <td nz-td [nzCheckbox]="true">
                <label nz-checkbox [(ngModel)]="data.checked" (ngModelChange)="_refreshStatus($event)">
                </label>
            </td>
            <td nz-td>{{data.cour_name}}</td>
            <td nz-td><a class="click-color" (click)="showProjects(data)">{{data.courNum}}</a></td>
            <td nz-td><a class="click-color" (click)="ClassAbout(data)">{{data.classNum}}</a></td>
            <td nz-td>
                <span>
                  <a (click)="modal ('update', data)">修改</a>
                  <span nz-table-divider></span>
                  <a (click)="showConfirm(data)">删除</a>
                </span>
            </td>
        </tr>
        </tbody>
    </nz-table>
    <nz-modal  [nzWrapClassName]="'vertical-center-modal'" [nzVisible]="modalVisible2" [nzTitle]="popTitle" [nzConfirmLoading]="loading" [nzContent]="modalContent2"
               (nzOnCancel)="modalVisible2=false" [nzOkText]="'确定'" [nzCancelText]="'取消'" (nzOnOk)="save()">
        <ng-template #modalContent2>
            <form nz-form [nzType]="'horizontal'" [formGroup]="validateForm">
                <div nz-form-item class="d-flex d-flex-margin">
                    <div nz-form-item-required class="til-box flex-1">课程名称：</div>
                    <div nz-form-control class="flex-4" style="flex: 4;" nzHasFeedback  [nzValidateStatus]="getFormControl('C_name')">
                        <nz-input [(ngModel)]="Cname" name="description" [nzSize]="'large'" formControlName="C_name"  [nzPlaceHolder]="'请输入'" nzId="no"></nz-input>
                        <div nz-form-explain *ngIf="getFormControl('C_name').dirty&&getFormControl('C_name').hasError('required')">课程名称不能为空！</div>
                    </div>
                </div>
            </form>
            <div nz-form-item class="d-flex d-flex-margin">
                <div nz-form-label class="til-box flex-1">已关联班级：</div>
                <div nz-form-control class="flex-4"  style="flex: 4;width: 80%;">
                    <nz-select style="width: 100%;"
                               [nzMode]="'multiple'"
                               [nzPlaceHolder]="'请选择关联班级'"
                               [nzSize]="'large'"
                               [(ngModel)]="selectedMultipleOption"
                               [nzNotFoundContent]="'暂无结果'">
                        <nz-option
                            *ngFor="let option of searchOptions"
                            [nzLabel]="option.cla_name"
                            [nzValue]="option.cla_id"
                            [nzDisabled]="option.disabled">
                        </nz-option>
                    </nz-select>
                </div>
            </div>
        </ng-template>
    </nz-modal>
    <nz-modal  [nzWrapClassName]="'vertical-center-modal'" [nzVisible]="showProject" [nzTitle]="'查看关联项目'" [nzConfirmLoading]="loading" [nzContent]="modalContent"
               (nzOnCancel)="CheckFalse()" [nzOkText]="'确定'" [nzCancelText]="'取消'" (nzOnOk)="checkProject()" [nzStyle]="style">
        <ng-template #modalContent>
            <div nz-form-item class="d-flex d-flex-margin">
                <div nz-form-label class="til-box tils">课程名称：</div>
                <div nz-form-control class="flex-1">
                    {{ProjectName}}
                </div>
            </div>
            <div nz-form-item class="d-flex d-flex-margin">
                <div nz-form-label class="til-box tils">已关联项目：</div>
            </div>
            <div class="check-group-box">
                <ul class="student-box">
                    <li *ngFor="let i of pro;let index = index;">
                        <div class="check-pop"><label nz-checkbox [(ngModel)]="i.checked"></label></div>
                        <img  _src="{{ IP_PORT+i.p_image }}" class="header-img"/>
                        <div class="student-news">
                            <p>{{i.p_name}}</p>
                            <p>{{i.p_date.slice(0,10)}}</p>
                        </div>
                    </li>
                </ul>
            </div>
        </ng-template>
    </nz-modal>
    <nz-modal  [nzWrapClassName]="'vertical-center-modal'" [nzFooter]="''" [nzVisible]="showClass" [nzTitle]="'开始授课'" [nzConfirmLoading]="loading" [nzContent]="modalContent1"
               (nzOnCancel)="showClass=false" (nzOnOk)="showClass=false" [nzStyle]="style" [nzOkText]="'确定'" [nzCancelText]="'取消'">
        <ng-template #modalContent1>
            <nz-table #nzTable [nzDataSource]="classList" [nzPageSize]="3" (nzPageSizeChange)="_refreshStatus()" [nzLoading]="_loading">
                <thead nz-thead>
                <tr>
                    <th  nz-th><span>班级名称</span></th>
                    <th  nz-th><span>项目名称</span></th>
                    <th  nz-th><span>项目属性</span></th>
                    <th  nz-th><span>操作</span></th>
                </tr>
                </thead>
                <tbody nz-tbody>
                <tr nz-tbody-tr *ngFor="let data of nzTable.data;let i = index">
                    <td nz-td>{{data.cla_name }}</td>
                    <td nz-td>{{data.p_name }}</td>
                    <td nz-td>{{data.p_type | json:'label'}}</td>
                    <td nz-td>
                <span (click)="play(data )">
                  <i class="anticon anticon-caret-right"></i>
                </span>
                    </td>
                </tr>
                </tbody>
            </nz-table>
        </ng-template>
    </nz-modal>
</nz-tab>
